<template>
 <div id='card'>
	 <!-- 文章布局 -->
	<Card class="card" >
		<h3>{{title}}</h3>
		<p v-html="content" class="content"></p>
		<!-- <p  class="content"></p> -->
		<div class="time">
			<p class="publishTime">{{time}}</p>
			<p class="like">
				<Icon type="ios-thumbs-up-outline" @click="changeLike(id)" /><span>{{like}}</span>
				<Icon type="ios-mail-outline"  /><span>{{reviewNum}}</span>
				<Icon type="ios-people-outline"  /><span>{{visitNum}}</span>
			</p>
		</div>
		<div class="tag">
			<Tag type="dot"  color="success">{{categroy}}</Tag>
			<Tag size="medium" v-for='(item,index) in tagsList' :key='index'>{{item}}</Tag>
		</div>
	</Card>
 </div>
</template>

<script>
export default {
  name: 'card',
  props:{
    title:{
      type:String,default:'测试标题'
    },
    time:{
      type:String,default:'2020-07-08 16:16:16'
    },
    content:{
      type:String,default:''
    },
    
    visitNum:{
      type:Number,default:999
    },
    like:{
      type:Number,default:999
    },
    id:{
      type:Number,default:0
    },
    article_id:{
      type:String,default:''
    },
    reviewNum:{
      type:Number,default:0
    },
    lable:{
      type:String,default:''
    },
    categroy:{
      type:String,default:'测试标签'
    }
  },
  data() {
      return {
		// like:16,
		// reviewNum:16,
		// visitNum:16,
		// time:'2020-07-08 16:16:16',
		// title:'测试标题'
		tagsList:[
			'标题1','标题2','标题3'
		]
      };
  },
  components:{
    
  },
  mounted() {
    
  },
  methods:{
    changeLike(id){
		console.log(123)
	}
  },
  computed: {
    
  }
}
</script>

<style lang="less" scoped>
#Card{
	display: flex;
	border: 1px solid red;
	.card{
		
	}
}
</style>
